<%@ taglib prefix="spring" uri="http://www.springframework.org/tags" %>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<%--
  Created by IntelliJ IDEA.
  User: qupen
  Date: 2016/12/8
  Time: 10:16
  To change this template use File | Settings | File Templates.
--%>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<jsp:include page="../include/head.jsp">
    <jsp:param name="title" value="事件管理列表"/>
</jsp:include>
<link rel="stylesheet" href="/css/select2.css">
<jsp:include page="../include/admin_header.jsp"/>

<jsp:include page="../include/admin_sidebar.jsp"/>
<div class="content-wrapper content-wrapper-bg">
    <section class="content-header">
        <h4 class="page-title" style="display: inline-block"><spring:message code="label.message.list"/></h4>
        <a class="btn btn-add  pull-right" id="showOrHide" href="javascript:;" style="margin-left:44px;">
            <spring:message code="label.user.show.search"/>
        </a>
    </section>
    <section class="content">
        <div class="hidden" style="margin-bottom: 15px;" id="showOrHideSearch">
            <div class="row" style="margin-left: 0;margin-right: 0;">
                <div class="col-md-4" style="margin-top: 5px;padding-left: 0;padding-right: 0;">
                    <label style="width: 110px;"><spring:message code="label.event.type"/>:</label>
                    <select id="event_type" class="form-control sie-input-border sie-input-uwh"
                            style="width: 150px;padding: 1px 12px;margin-right: 0;" onchange="loadService(this.value)">
                        <option value=""><spring:message code="label.select"/></option>
                        <c:forEach items="${events}" var="event">
                            <option value="${event.getEventId()}">${event.getEventName()}</option>
                        </c:forEach>
                    </select>
                </div>
                <div class="col-md-4" style="margin-top: 5px;padding-left: 0;padding-right: 0;">
                    <label style="width: 78px;"><spring:message code="label.operator"/>:</label>

                    <select id="executant" class="form-control sie-input-border sie-input-uwh" style="width: 150px;">

                    </select>
                </div>
                <div class="col-md-4" style="margin-top: 5px;padding-left: 0;padding-right: 0;">
                    <label style="width: 78px;"><spring:message code="label.operand"/>:</label>

                    <select id="operands" class="form-control sie-input-border sie-input-uwh" style="width: 150px;">

                    </select>
                </div>
            </div>

            <div class="row" style="margin-left: 0;margin-right: 0;">
                <div class="col-md-4" style="margin-top: 5px;padding-left: 0;padding-right: 0;">
                    <label style="width: 110px;"><spring:message code="label.related.service"/>:</label>
                    <select id="service" class="form-control sie-input-border sie-input-uwh"
                            style="width: 150px;padding: 1px 12px;margin-right: 0;" disabled="disabled">
                        <option value=""><spring:message code="label.select"/></option>
                        <c:forEach items="${services}" var="service">
                            <option value="${service.service_id}">${service.service_name}</option>
                        </c:forEach>
                    </select>
                </div>
                <div class="col-md-4" style="margin-top: 5px;padding-left: 0;padding-right: 0;">
                    <label style="width: 78px;"><spring:message code="label.time"/>:</label>

                    <div class="sie-calendar-parent">
                        <input type="text" readonly="readonly" class="form-control sie-calendar-input" id="create_time"
                               style="width: 150px;">
                        <img src="/images/calendar.png" class="sie-calendar-img"/>
                    </div>
                </div>
                <div class="col-md-4" style="margin-top: 5px;padding-left: 0;padding-right: 0;">
                    <label style="width: 78px;"></label>
                    <a id="search" class="solid-button-orange" href="javascript:;" style="width: 150px;"><spring:message
                            code="label.admin.search"/></a>
                </div>
            </div>
        </div>
        <div class="box box-primary table-header-line">
            <div class="box-body" style="padding: 0">
                <table class="table" id="user_list">
                    <thead>
                    <tr>
                        <th><spring:message code="label.event.type"/></th>
                        <th><spring:message code="label.operator"/></th>
                        <th><spring:message code="label.operand"/></th>
                        <th><spring:message code="label.related.service"/></th>
                        <th><spring:message code="label.time"/></th>
                    </tr>
                    </thead>
                    <tbody>
                    </tbody>
                </table>
            </div>
        </div>
        <%--</div>--%>
    </section>
</div>
<jsp:include page="../include/foot.jsp"/>
<script src="/js/select2.full.min.js"></script>
<script>
    $(document).ready(function () {
        $('#executant').select2({
                    placeholder: '<spring:message code="label.tenant.please.enter.idle"/>',
                    minimumInputLength: 1,
                    paging: false,
                    searching: false,
                    multiple: false,
                    allowClear: true,
                    ajax: {
                        url:"/admin/api/v1message/getExecutant",
                        dataType: "json",
                        type: 'GET',
                        data: function (params) {
                            return {str: params.term.trim()};
                        },
                        processResults: function (data) {
                            var results = [];
                            $.each(data.data, function (i, v) {
                                var o = {};
                                o.id = v.executant;
                                o.text = v.executant/* + "(" + v.device_name + ")"*/;
                                results.push(o);
                            });
                            return {
                                results: results
                            };
                        },
                        cache: true
                    },
                    escapeMarkup: function (m) {
                        return m;
                    }
                })
                .on('hide.bs.modal', function () {
                    $('#executant').empty();
                });
        loadDataTables();
    });
    $(document).ready(function () {
        $('#operands').select2({
                    placeholder: '<spring:message code="label.tenant.please.enter.idle"/>',
                    minimumInputLength: 1,
                    paging: false,
                    searching: false,
                    multiple: false,
                    allowClear: true,
                    ajax: {
                        url: "/admin/api/v1/message/getOperands",
                        dataType: "json",
                        type: 'GET',
                        data: function (params) {
                            return {str:params.term.trim()};
                        },
                        processResults: function (data) {
                            var results = [];
                            $.each(data.data, function (i, v) {
                                var o = {};
                                o.id = v.operands;
                                o.text = v.operands;
                                results.push(o);
                            });
                            return {
                                results: results
                            };
                        },
                        cache: true
                    },
                    escapeMarkup: function (m) {
                        return m;
                    }
                })
                .on('hide.bs.modal', function () {
                    $('#operands').empty();
                });
    });
    $(document).ready(function () {
        $('#create_time').datepicker({
            language: "zh-CN",
            autoclose: true,
            format: "yyyy-mm-dd",
            todayHighlight:true
        });
        bindDateInputClickEvent();
    });
    $(document).ready(function () {
        $("#showOrHide").click(function () {
            if ($("#showOrHideSearch").hasClass("hidden")) {
                $("#showOrHideSearch").removeClass('hidden');
                $("#showOrHide").text('<spring:message code="label.user.hide.search"/>');
            } else {
                $("#showOrHideSearch").addClass('hidden');
                $("#showOrHide").text('<spring:message code="label.user.show.search"/>');
            }

        });

        $('#search').click(function () {
            loadDataTables();
        });
    });
    function loadDataTables() {
        var data = {};
        data['eventType'] = $("#event_type option:selected").val() == undefined ? "" : $("#event_type option:selected").val();
        data['executant'] = $('#executant option:selected').text() == undefined ? "" : $('#executant option:selected').text();
        data['operands'] = $("#operands option:selected").val() == undefined ? "" : $("#operands option:selected").val();
        data['service'] = $("#service option:selected").val() == (undefined||"") ? "" : $("#service option:selected").text();
        data['createTime'] = $("#create_time").val();
        var table = $('#user_list').DataTable({
            "dom": '<"datatable-header"<"dataTables_filter">l><"datatable-scroll"t><"datatable-footer dataTable-footer-padding"<"pull-left"i><"pull-right"p>>',
            paging: true,
            lengthChange: false,
            ordering: true,
            autoWidth: false,
            info: true,
            "searching": false,
            "destroy": true,
            serverSide: true,
            fixedHeader: true,
            aLengthMenu: [15],
            ajax: {
                url: '/admin/api/v1/messages',
                data: data,
                dataSrc: 'data'
            },
            "columns": [
                {"data": "event_name"},
                {"data": "executant"},
                {"data": "operands"},
                {"data": "service_id"},
                {
                    "data": "create_time",
                    "render": function (data, type, full, meta) {
                        return new Date(data).formatXl();
                    }
                }
            ],
            "language": {url: '/lang/datatable.chs.json'}
        });
    }

    function loadService(value){
        if(value ==3||value ==4){
            $("#service").attr("disabled",false);
            $("#service option:first").attr("selected",true);
        }else {
            $("#service").attr("disabled",true);
            $("#service option:first").attr("selected",true);
        }
    }
</script>


